﻿/// <reference path="../Core.ts" />

module Supernova {

    export class ReplayRatingUI implements UI.ISwitchableUI {

        layout = {
            rootPanel: {
                top: 50, width: 400, bottom: 0,
                controls: {
                    welcomeTitle: {
                        top: 0, width: 400, height: 30,
                        text: 'Supernova Multiplayer Replays'
                    },
                    requestLabel: {
                        top: 40, width: 400, height: 30,
                        text: 'Please rate the replay you just watched!'
                    },
                    rate0Button: {
                        top: 80, width: 400, height: 30,
                        text: 'Zero Stars',
                        tag: 0,
                        onClick: this.handleRatingButtonClicked
                    },
                    rate1Button: {
                        top: 120, width: 400, height: 30,
                        text: '*',
                        tag: 1,
                        onClick: this.handleRatingButtonClicked
                    },
                    rate2Button: {
                        top: 160, width: 400, height: 30,
                        text: '**',
                        tag: 2,
                        onClick: this.handleRatingButtonClicked
                    },
                    rate3Button: {
                        top: 200, width: 400, height: 30,
                        text: '***',
                        tag: 3,
                        onClick: this.handleRatingButtonClicked
                    },
                    rate4Button: {
                        top: 240, width: 400, height: 30,
                        text: '****',
                        tag: 4,
                        onClick: this.handleRatingButtonClicked
                    },
                    rate5Button: {
                        top: 280, width: 400, height: 30,
                        text: '*****',
                        tag: 5,
                        onClick: this.handleRatingButtonClicked
                    },
                    disconnectButton: {
                        top: 320, width: 400, height: 30,
                        text: 'Skip',
                        onClick: this.handleDisconnectButtonChecked
                    },
                }
            }
        }

        public root: UI.UIControl = null;

        constructor() {
            this.root = UI.compile(this.layout)[0];
        }

        show() {
        }

        hide() {
        }

        handleRatingButtonClicked(sender, e) {
            var rating = <number>sender.tag;
            channel.invoke.rateReplay(rating);
        }

        handleDisconnectButtonChecked(sender, e) {
            channel.disconnect();
            resetToMainMenu();
        }

    }

}